<template>
  <el-dialog :title="!dataForm.id ? '新建' :'编辑'"
             :close-on-click-modal="false" append-to-body
             :visible.sync="visible" class="JNPF-dialog JNPF-dialog_center" lock-scroll
             width="600px">
    <el-row :gutter="15" class="">
      <el-form ref="formRef" :model="dataForm" :rules="dataRule" size="small" label-width="100px"
               label-position="right">
        <template v-if="!loading">
          <!-- 具体表单 -->
          <el-col :span="4">
            <el-row :gutter="15">
              <el-col :span="24">
                <jnpf-form-tip-item>
                  <JnpfText
                    :textStyle='{"color":"#000000","font-weight":"normal","text-decoration":"none","font-size":12,"line-height":32,"font-style":"normal","text-align":"left"}'>
                  </JnpfText>
                </jnpf-form-tip-item>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="16">
            <el-row :gutter="15">
              <el-col :span="24">
                <jnpf-form-tip-item>
                  <JnpfText
                    :textStyle='{"color":"#000000","font-weight":"bold","text-decoration":"none","font-size":20,"line-height":22,"font-style":"normal","text-align":"center"}'
                    content="Saas化服务">
                  </JnpfText>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="软件名称" prop="name">
                  <JnpfInput v-model="dataForm.name" @change="changeData('name',-1)"
                             placeholder="请输入" clearable :style='{"width":"100%"}'>
                  </JnpfInput>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="软件类型" prop="softtype">
                  <JnpfSelect v-model="dataForm.softtype" @change="changeData('softtype',-1)"
                              placeholder="请选择" clearable :style='{"width":"100%"}' :options="softtypeOptions"
                              :props="softtypeProps">
                  </JnpfSelect>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="产品类别" prop="producttype">
                  <JnpfCascader v-model="dataForm.producttype" @change="changeData('producttype',-1)"
                                placeholder="请选择" show-all-levels clearable :style='{"width":"100%"}' separator="/"
                                :options="producttypeOptions" :props="producttypeProps">
                  </JnpfCascader>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="操作系统" prop="os">
                  <JnpfCheckbox v-model="dataForm.os" @change="changeData('os',-1)"
                                optionType="default" direction="horizontal" size="small" :options="osOptions"
                                :props="osProps">
                  </JnpfCheckbox>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="产品简介" prop="description">
                  <JnpfTextarea v-model="dataForm.description" @change="changeData('description',-1)"
                                placeholder="请输入" :style='{"width":"100%"}' true type="textarea"
                                :autosize='{"minRows":4,"maxRows":4}'>
                  </JnpfTextarea>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="图片" prop="pic">
                  <JnpfUploadImg v-model="dataForm.pic" @change="changeData('pic',-1)"
                                 :fileSize="10" sizeUnit="MB" :limit="1" pathType="defaultPath" :isAccount="0">
                  </JnpfUploadImg>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="功能特点" prop="funcspec">
                  <JnpfEditor v-model="dataForm.funcspec" @change="changeData('funcspec',-1)"
                              placeholder="请输入" :style='{"width":"100%"}'>
                  </JnpfEditor>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="案例介绍" prop="caseinfo">
                  <JnpfEditor v-model="dataForm.caseinfo" @change="changeData('caseinfo',-1)"
                              placeholder="请输入" :style='{"width":"100%"}'>
                  </JnpfEditor>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="下载方式" prop="downloadmethod">
                  <JnpfRadio v-model="dataForm.downloadmethod" @change="changeData('downloadmethod',-1)"
                             optionType="default" direction="horizontal" size="small" :options="downloadmethodOptions"
                             :props="downloadmethodProps">
                  </JnpfRadio>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="安装包上传" prop="package">
                  <JnpfUploadFile v-model="dataForm.package" @change="changeData('package',-1)"
                                  :fileSize="10" sizeUnit="MB" :limit="9" pathType="defaultPath" :isAccount="0"
                                  buttonText="点击上传">
                  </JnpfUploadFile>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="下载地址" prop="url">
                  <JnpfInput v-model="dataForm.url" @change="changeData('url',-1)"
                             placeholder="请输入" clearable :style='{"width":"100%"}'>
                  </JnpfInput>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="联系电话" prop="phone">
                  <JnpfInput v-model="dataForm.phone" @change="changeData('phone',-1)"
                             placeholder="请输入" clearable :style='{"width":"100%"}'>
                  </JnpfInput>
                </jnpf-form-tip-item>
              </el-col>
              <el-col :span="24">
                <jnpf-form-tip-item
                  label="联系邮箱" prop="email">
                  <JnpfInput v-model="dataForm.email" @change="changeData('email',-1)"
                             placeholder="请输入" clearable :style='{"width":"100%"}'>
                  </JnpfInput>
                </jnpf-form-tip-item>
              </el-col>
            </el-row>
          </el-col>
          <el-col :span="4">
            <el-row :gutter="15">
              <el-col :span="24">
                <jnpf-form-tip-item>
                  <JnpfText
                    :textStyle='{"color":"#000000","font-weight":"normal","text-decoration":"none","font-size":12,"line-height":32,"font-style":"normal","text-align":"left"}'>
                  </JnpfText>
                </jnpf-form-tip-item>
              </el-col>
            </el-row>
          </el-col>
          <!-- 表单结束 -->
        </template>
      </el-form>
      <SelectDialog v-if="selectDialogVisible" :config="currTableConf" :formData="dataForm"
                    ref="selectDialog" @select="addForSelect" @close="selectDialogVisible=false"/>
    </el-row>
    <span slot="footer" class="dialog-footer">
                    <div class="upAndDown-button" v-if="dataForm.id">
                <el-button @click="prev" :disabled='prevDis'>
                  {{ '上一条' }}
                </el-button>
                <el-button @click="next" :disabled='nextDis'>
                  {{ '下一条' }}
                </el-button>
              </div>
                <el-button type="primary" @click="dataFormSubmit(2)" :loading="continueBtnLoading">
            {{ !dataForm.id ? '确定并新增' : '确定并继续' }}</el-button>
              <el-button @click="visible = false"> 取 消</el-button>
              <el-button type="primary" @click="dataFormSubmit()" :loading="btnLoading"> 确 定</el-button>
        </span>
  </el-dialog>
</template>


<script>
import request from '@/utils/request'
import {mapGetters} from "vuex";
import {getDataInterfaceRes} from '@/api/systemData/dataInterface'
import {getDictionaryDataSelector} from '@/api/systemData/dictionary'
import {getDefaultCurrentValueUserId} from '@/api/permission/user'
import {getDefaultCurrentValueDepartmentId} from '@/api/permission/organize'
import {
  getDateDay,
  getLaterData,
  getBeforeData,
  getBeforeTime,
  getLaterTime
} from '@/components/Generator/utils/index.js'
import {thousandsFormat} from "@/components/Generator/utils/index"

export default {
  components: {},
  props: [],
  data() {
    return {
      dataFormSubmitType: 0,
      continueBtnLoading: false,
      index: 0,
      prevDis: false,
      nextDis: false,
      allList: [],
      visible: false,
      loading: false,
      btnLoading: false,
      formRef: 'formRef',
      setting: {},
      eventType: '',
      userBoxVisible: false,
      selectDialogVisible: false,
      currTableConf: {},
      dataValueAll: {},
      addTableConf: {},
      //可选范围默认值
      ableAll: {},
      tableRows: {},
      Vmodel: "",
      currVmodel: "",
      dataForm: {
        name: undefined,
        softtype: undefined,
        producttype: [],
        os: [],
        description: undefined,
        pic: [],
        funcspec: undefined,
        caseinfo: undefined,
        downloadmethod: undefined,
        package: [],
        url: undefined,
        phone: undefined,
        email: undefined,
        status: undefined,
      },
      tableRequiredData: {},
      dataRule:
        {},
      softtypeOptions: [{"fullName": "大众免费使用", "id": "1"}, {"fullName": "购买使用", "id": "2"}],
      softtypeProps: {"label": "fullName", "value": "id"},
      producttypeOptions: [{
        "children": [{"fullName": "CAD", "id": "1-1"}, {
          "fullName": "CAE",
          "id": "1-2"
        }, {"fullName": "CAPP", "id": "1-3"}, {"fullName": "CAM", "id": "1-4"}, {"fullName": "数字孪生", "id": "1-5"}],
        "fullName": "研发制造",
        "id": "1"
      }, {
        "children": [{"fullName": "PLM", "id": "2-1"}, {"fullName": "PDM", "id": "2-2"}, {
          "fullName": "DNC",
          "id": "2-3"
        }, {"fullName": "MDC", "id": "2-4"}, {"fullName": "QMC", "id": "2-5"}, {
          "fullName": "LIMS",
          "id": "2-6"
        }, {"fullName": "MES", "id": "2-7"}, {"fullName": "APS", "id": "2-8"}], "fullName": "生产制造", "id": "2"
      }, {
        "children": [{"fullName": "ERP", "id": "3-1"}, {"fullName": "CRM", "id": "3-2"}, {
          "fullName": "SRM",
          "id": "3-3"
        }, {"fullName": "SCM", "id": "3-4"}, {"fullName": "OA", "id": "3-5"}, {
          "fullName": "BI",
          "id": "3-6"
        }, {"fullName": "FMIS", "id": "3-7"}, {"fullName": "BOM", "id": "3-8"}, {
          "fullName": "WMS",
          "id": "3-9"
        }, {"fullName": "MRP", "id": "3-10"}], "fullName": "经营管理", "id": "3"
      }, {
        "children": [{"fullName": "监控系统", "id": "4-1"}, {"fullName": "日志管理系统", "id": "4-2"}, {
          "fullName": "故障管理系统",
          "id": "4-3"
        }, {"fullName": "安全管理系统", "id": "4-4"}], "fullName": "运维服务", "id": "4"
      }, {"fullName": "其他", "id": "5"}],
      producttypeProps: {"label": "fullName", "value": "id", "children": "children"},
      osOptions: [{"fullName": "Windows", "id": "Windows"}, {"fullName": "macOS", "id": "macOS"}, {
        "fullName": "Linux",
        "id": "Linux"
      }, {"fullName": "Android", "id": "Android"}, {"fullName": "iOS", "id": "iOS"}, {
        "fullName": "RTOS",
        "id": "RTOS"
      }, {"fullName": "其他", "id": "other"}],
      osProps: {"label": "fullName", "value": "id"},
      downloadmethodOptions: [{"fullName": "超链接", "id": "Link"}, {"fullName": "安装包下载", "id": "Installer"}],
      downloadmethodProps: {"label": "fullName", "value": "id"},
      statusOptions: [{"fullName": "草稿", "id": "0"}, {"fullName": "处理", "id": "1"}, {
        "fullName": "通过",
        "id": "2"
      }, {"fullName": "驳回", "id": "3"}, {"fullName": "撤销", "id": "4"}, {
        "fullName": "终止",
        "id": "5"
      }, {"fullName": "不通过", "id": "6"}],
      statusProps: {"label": "fullName", "value": "id"},
      childIndex: -1,
      isEdit: false,
      interfaceRes: {
        name: [],
        softtype: [],
        producttype: [],
        os: [],
        description: [],
        pic: [],
        funcspec: [],
        caseinfo: [],
        downloadmethod: [],
        package: [],
        url: [],
        phone: [],
        email: [],
        status: [],
      },
    }
  },
  computed: {
    ...mapGetters(['userInfo'])
  },
  watch: {},
  created() {
    this.dataAll()
    this.initDefaultData()
    this.dataValueAll = JSON.parse(JSON.stringify(this.dataForm))
  },
  mounted() {
  },
  methods: {
    prev() {
      this.index--
      if (this.index === 0) {
        this.prevDis = true
      }
      this.nextDis = false
      for (let index = 0; index < this.allList.length; index++) {
        const element = this.allList[index];
        if (this.index == index) {
          this.getInfo(element.id)
        }
      }
    },
    next() {
      this.index++
      if (this.index === this.allList.length - 1) {
        this.nextDis = true
      }
      this.prevDis = false
      for (let index = 0; index < this.allList.length; index++) {
        const element = this.allList[index];
        if (this.index == index) {
          this.getInfo(element.id)
        }
      }
    },
    getInfo(id) {
      request({
        url: '/api/example/Fz_saas_product/' + id,
        method: 'get'
      }).then(res => {
        this.dataInfo(res.data)
      });
    },
    goBack() {
      this.visible = false
      this.$emit('refreshDataList', true)
    },
    changeData(model, index) {
      this.isEdit = false
      this.childIndex = index
      let modelAll = model.split("-");
      let faceMode = "";
      for (let i = 0; i < modelAll.length; i++) {
        faceMode += modelAll[i];
      }
      for (let key in this.interfaceRes) {
        if (key != faceMode) {
          let faceReList = this.interfaceRes[key]
          for (let i = 0; i < faceReList.length; i++) {
            if (faceReList[i].relationField == model) {
              let options = 'get' + key + 'Options';
              if (this[options]) {
                this[options]()
              }
              this.changeData(key, index)
            }
          }
        }
      }
    },
    changeDataFormData(type, data, model, index, defaultValue) {
      if (!this.isEdit) {
        if (type == 2) {
          for (let i = 0; i < this.dataForm[data].length; i++) {
            if (index == -1) {
              this.dataForm[data][i][model] = defaultValue
            } else if (index == i) {
              this.dataForm[data][i][model] = defaultValue
            }
          }
        } else {
          this.dataForm[data] = defaultValue
        }
      }
    },
    dataAll() {
    },
    clearData() {
      this.dataForm = JSON.parse(JSON.stringify(this.dataValueAll))
    },
    init(id, isDetail, allList) {
      this.prevDis = false
      this.nextDis = false
      this.allList = allList || []
      if (allList.length) {
        this.index = this.allList.findIndex(item => item.id === id)
        if (this.index == 0) {
          this.prevDis = true
        }
        if (this.index == this.allList.length - 1) {
          this.nextDis = true
        }
      } else {
        this.prevDis = true
        this.nextDis = true
      }
      this.dataForm.id = id || 0;
      this.visible = true;
      this.$nextTick(() => {
        if (this.dataForm.id) {
          this.loading = true
          request({
            url: '/api/example/Fz_saas_product/' + this.dataForm.id,
            method: 'get'
          }).then(res => {
            this.dataInfo(res.data)
            this.loading = false
          });
        } else {
          this.clearData()
          this.initDefaultData()
        }
      });
      this.$store.commit('generator/UPDATE_RELATION_DATA', {})
    },
    //初始化默认数据
    initDefaultData() {

    },
    // 表单提交
    dataFormSubmit(type) {
      this.dataFormSubmitType = type ? type : 0
      this.$refs['formRef'].validate((valid) => {
        if (valid) {
          this.request()
        }
      })
    },
    request() {
      let _data = this.dataList()
      if (this.dataFormSubmitType == 2) {
        this.continueBtnLoading = true
      } else {
        this.btnLoading = true
      }
      if (!this.dataForm.id) {
        request({
          url: '/api/example/Fz_saas_product',
          method: 'post',
          data: _data
        }).then((res) => {
          this.$message({
            message: res.msg,
            type: 'success',
            duration: 1000,
            onClose: () => {
              if (this.dataFormSubmitType == 2) {
                this.$nextTick(() => {
                  this.clearData()
                  this.initDefaultData()
                })
                this.continueBtnLoading = false
                return
              }
              this.visible = false
              this.btnLoading = false
              this.$emit('refresh', true)
            }
          })
        }).catch(() => {
          this.btnLoading = false
          this.continueBtnLoading = false
        })
      } else {
        request({
          url: '/api/example/Fz_saas_product/' + this.dataForm.id,
          method: 'PUT',
          data: _data
        }).then((res) => {
          this.$message({
            message: res.msg,
            type: 'success',
            duration: 1000,
            onClose: () => {
              if (this.dataFormSubmitType == 2) return this.continueBtnLoading = false
              this.visible = false
              this.btnLoading = false
              this.$emit('refresh', true)
            }
          })
        }).catch(() => {
          this.btnLoading = false
          this.continueBtnLoading = false
        })
      }
    },
    openSelectDialog(key) {
      this.currTableConf = this.addTableConf[key]
      this.currVmodel = key
      this.selectDialogVisible = true
      this.$nextTick(() => {
        this.$refs.selectDialog.init()
      })
    },
    addForSelect(data) {
      for (let i = 0; i < data.length; i++) {
        let t = data[i]
        if (this['get' + this.currVmodel]) {
          this['get' + this.currVmodel](t)
        }
      }
    },
    dateTime(timeRule, timeType, timeTarget, timeValueData, dataValue) {
      let timeDataValue = null;
      let timeValue = Number(timeValueData)
      if (timeRule) {
        if (timeType == 1) {
          timeDataValue = timeValue
        } else if (timeType == 2) {
          timeDataValue = dataValue
        } else if (timeType == 3) {
          timeDataValue = new Date().getTime()
        } else if (timeType == 4) {
          let previousDate = '';
          if (timeTarget == 1 || timeTarget == 2) {
            previousDate = getDateDay(timeTarget, timeType, timeValue)
            timeDataValue = new Date(previousDate).getTime()
          } else if (timeTarget == 3) {
            previousDate = getBeforeData(timeValue)
            timeDataValue = new Date(previousDate).getTime()
          } else {
            timeDataValue = getBeforeTime(timeTarget, timeValue).getTime()
          }
        } else if (timeType == 5) {
          let previousDate = '';
          if (timeTarget == 1 || timeTarget == 2) {
            previousDate = getDateDay(timeTarget, timeType, timeValue)
            timeDataValue = new Date(previousDate).getTime()
          } else if (timeTarget == 3) {
            previousDate = getLaterData(timeValue)
            timeDataValue = new Date(previousDate).getTime()
          } else {
            timeDataValue = getLaterTime(timeTarget, timeValue).getTime()
          }
        }
      }
      return timeDataValue;
    },
    time(timeRule, timeType, timeTarget, timeValue, formatType, dataValue) {
      let format = formatType == 'HH:mm' ? 'HH:mm:00' : formatType
      let timeDataValue = null
      if (timeRule) {
        if (timeType == 1) {
          timeDataValue = timeValue || '00:00:00'
          if (timeDataValue.split(':').length == 3) {
            timeDataValue = timeDataValue
          } else {
            timeDataValue = timeDataValue + ':00'
          }
        } else if (timeType == 2) {
          timeDataValue = dataValue
        } else if (timeType == 3) {
          timeDataValue = this.jnpf.toDate(new Date(), format)
        } else if (timeType == 4) {
          let previousDate = '';
          previousDate = getBeforeTime(timeTarget, timeValue)
          timeDataValue = this.jnpf.toDate(previousDate, format)
        } else if (timeType == 5) {
          let previousDate = '';
          previousDate = getLaterTime(timeTarget, timeValue)
          timeDataValue = this.jnpf.toDate(previousDate, format)
        }
      }
      return timeDataValue;
    },
    dataList() {
      var _data = this.dataForm;
      return _data;
    },
    dataInfo(dataAll) {
      let _dataAll = dataAll
      this.dataForm = _dataAll
      this.isEdit = true
      this.dataAll()
      this.childIndex = -1
    },
  },
}

</script>
